<template>
    <view class=" bg-[#F8F8F8] px-[10rpx] py-[8rpx] min-h-screen">
        <view class="bg-white">
            <uni-swiper-dot class="uni-swiper-dot-box" :info="info" :current="current" mode="round" field="content">
            <swiper class="swiper-box" @change="change" :current="swiperDotIndex">
                <swiper-item v-for="(item, index) in info" :key="index">
                    <image mode="aspectFill" :src="item.url" class=" w-[100%] h-[348rpx]"></image>
                </swiper-item>
            </swiper>
        </uni-swiper-dot>
        </view>
 

        <view class="mt-[13rpx] bg-white">
      
            <view class="text-[38rpx] flex items-center justify-between border-b border-[#F8F8F8] mx-[20rpx] py-[38rpx]">
                <view class="flex items-center">
                    <text class="text-[#3D3D3D] w-[4em] ml-[20rpx]">上课打卡</text>
                    <view class="ml-[36rpx]">
                        <text class="text-[#979797]">学分</text>
                        <text class="text-[#fd755d]">+3</text>
                    </view>
                </view>

                <view class="px-[45rpx] py-[7rpx] text-[#fff] bg-[#FD755D] rounded-[375rpx]">领取</view>
            </view>
     
        
            <view class="text-[38rpx] flex items-center justify-between border-b border-[#F8F8F8] mx-[20rpx] py-[38rpx]">
                <view class="flex items-center">
                    <text class="text-[#3D3D3D] w-[4em] ml-[20rpx]">课程评价</text>
                    <view class="ml-[36rpx]">
                        <text class="text-[#979797]">学分</text>
                        <text class="text-[#fd755d]">+3</text>
                    </view>
                </view>

                <view class="px-[45rpx] py-[7rpx] text-[#fff] bg-[#FD755D] rounded-[375rpx]">领取</view>
            </view>
       
     
            <view class="text-[38rpx] flex items-center justify-between border-b border-[#F8F8F8] mx-[20rpx] py-[38rpx]">
                <view class="flex items-center">
                    <text class="text-[#3D3D3D] w-[4em] ml-[20rpx]">空中课堂</text>
                    <view class="ml-[36rpx]">
                        <text class="text-[#979797]">学分</text>
                        <text class="text-[#fd755d]">+3</text>
                    </view>
                </view>

                <view class="px-[45rpx] py-[7rpx] text-[#fff] bg-[#FD755D] rounded-[375rpx]">领取</view>
            </view>
       
       
            <view  class="text-[38rpx] flex items-center justify-between border-b border-[#F8F8F8] mx-[20rpx] py-[38rpx]">
                <view class="flex items-center">
                    <text class="text-[#3D3D3D] w-[4em] ml-[20rpx]">每日一题</text>
                    <view class="ml-[36rpx]">
                        <text class="text-[#979797]">学分</text>
                        <text class="text-[#fd755d]">+3</text>
                    </view>
                </view>

                <view @click="navigateTo('/pages/question/question')" class="px-[45rpx] py-[7rpx] text-[#fff] bg-[#FD755D] rounded-[375rpx]">领取</view>
            </view>
        
       
            <view class="text-[38rpx] flex items-center justify-between border-b border-[#F8F8F8] mx-[20rpx] py-[38rpx]">
                <view class="flex items-center">
                    <text class="text-[#3D3D3D] w-[4em] ml-[20rpx]">一键上传</text>
                    <view class="ml-[36rpx]">
                        <text class="text-[#979797]">学分</text>
                        <text class="text-[#fd755d]">+3</text>
                    </view>
                </view>

                <view class="px-[45rpx] py-[7rpx] text-[#fff] bg-[#FD755D] rounded-[375rpx]">领取</view>
            </view>
      
       
            <view class="text-[38rpx] flex items-center justify-between border-b border-[#F8F8F8] mx-[20rpx] py-[38rpx]">
                <view class="flex items-center">
                    <text class="text-[#3D3D3D] w-[4em] ml-[20rpx]">幸运分</text>
                    <view class="ml-[36rpx]">
                        <text class="text-[#979797]">学分</text>
                        <text class="text-[#fd755d]">+3</text>
                    </view>
                </view>

                <view class="px-[45rpx] py-[7rpx] text-[#fff] bg-[#FD755D] rounded-[375rpx]">领取</view>
            </view>
       
       
            <view class="text-[38rpx] flex items-center justify-between border-b border-[#F8F8F8] mx-[20rpx] py-[38rpx]">
                <view class="flex items-center">
                    <text class="text-[#3D3D3D] w-[4em] ml-[20rpx]">努力分</text>
                    <view class="ml-[36rpx]">
                        <text class="text-[#979797]">学分</text>
                        <text class="text-[#fd755d]">+3</text>
                    </view>
                </view>

                <view class="px-[45rpx] py-[7rpx] text-[#fff] bg-[#FD755D] rounded-[375rpx]">领取</view>
            </view>
        </view>
      
           
       
    </view>

</template>
<script setup>
import { ref, reactive, toRefs, watch, onMounted } from 'vue'
const info = ref([
    {
        url: 'https://www.aqvtc.edu.cn/_upload/article/images/75/c2/589547794559a79e48ba9ab6fdfa/469aac11-9132-4451-a77a-019a3324ba9c_d.jpg',
    }
])
const navigateTo =(url)=>{
  uni.navigateTo({
    url
  })
}
</script>